<template>
  <div class="custom_user_info">
    <div class="custom_user_info_content">
      <UserInfoHead :item="item.data.info">
        <template v-slot:userInfoHeadRight="{ item }">
          <router-link
            :to="{ name: 'userInfoContent', params: { uid: item.uid } }"
            class="custom_user_info_head_content_right_button"
          >
            {{ $t("lang.个人主页") }}<van-icon name="arrow" />
          </router-link>
        </template>
      </UserInfoHead>
      <UserInfoAside :item="item.data.aside"></UserInfoAside>
    </div>
  </div>
</template>
<script>
export default {
  name: "userInfo",
  props: {
    item: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  components: {
    UserInfoHead: () =>
      import(
        /* webpackChunkName:'userInfoHead' */ "../../components/userInfo/userInfoHead"
      ),
    UserInfoAside: () =>
      import(
        /* webpackChunkName:'userInfoAside' */ "../../components/userInfo/userInfoAside"
      ),
  },
  data() {
    return {};
  },
};
</script>
<style lang="less">
@base: 23.44rem;
.custom_user_info {
  a {
    &.custom_user_info_head_content_right_button {
      font-size: (12 / @base);
      vertical-align: middle;
      line-height: (72 / @base);
      .van-icon {
        vertical-align: middle;
      }
    }
  }
}
</style>
